<!--
 * @Author: ChunLai
 * @Date: 2023-07-25 14:42:59
 * @LastEditTime: 2025-08-21 11:22:56
 * @Description: 银行卡---签约
 * @FilePath: \02.bldinsure\src\views\bankcard\contract.vue
-->
<template>
  <div class="contract_page">
    <div class="mt10 mode_ul">
      <div class="li_cell" v-if="cardTypeLabel">
        <div class="cell_label">账户类型</div>
        <div class="cell_value">{{ cardTypeLabel }}</div>
      </div>
      <div class="li_cell" v-if="payModeLabel">
        <div class="cell_label">缴费方式</div>
        <div class="cell_value">{{ payModeLabel }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">银行名称</div>
        <div class="cell_value">{{ bankLabel }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">银行卡号</div>
        <div class="cell_value">{{ bankCardInfo.bankAccNo | fmtBankNum }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">账户姓名</div>
        <div class="cell_value">{{ bankCardInfo.bankAccName }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">证件类型</div>
        <div class="cell_value">{{ applicant.idName }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">证件号码</div>
        <div class="cell_value">{{ applicant.idNum }}</div>
      </div>
      <div class="li_cell">
        <div class="cell_label">单笔限额</div>
        <div class="cell_value">{{ limitMoney }}</div>
      </div>
    </div>
    <SmsCodeInput ref="smsCodeRef" @handleCheck="payAuthSureApi" />
    <FooterBtns btnNum="1" :rightText="signText" @saveForm="goSignBank" />
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { accountCodeFormat } from "@/methods/format.js";
import { bankCardSignHandleMixin } from "../pay/banksign.js";
import SmsCodeInput from "../pay/components/SmsCodeInput";

export default {
  name: "BankcardContractPage",
  data() {
    return {
      smscode: "",
    };
  },
  components: { SmsCodeInput },
  computed: {
    ...mapGetters({
      bankCardInfo: "insert/payInfo",
      bankList: "dictionary/bankList",
      payModeList: "dictionary/payModeList",
      bcardTypeList: "dictionary/bcardTypeList",
      applicant: "insert/applicant",
    }),
    payModeLabel() {
      let res = "";
      if (this.bankCardInfo.payMode !== void 0) {
        const obj = this.payModeList.find(
          (ele) => ele.value == this.bankCardInfo.payMode
        );
        if (obj) {
          res = obj.label;
        }
      }
      return res;
    },
    cardTypeLabel() {
      let res = "";
      if (this.bankCardInfo.bankCardType !== void 0) {
        const obj = this.bcardTypeList.find(
          (ele) => ele.value == this.bankCardInfo.bankCardType
        );
        if (obj) {
          res = obj.name;
        }
      }
      return res;
    },
    bankLabel() {
      let res = "";
      if (this.bankCardInfo.bankCode !== void 0) {
        const obj = this.bankList.find(
          (ele) => ele.keyId == this.bankCardInfo.bankCode
        );
        if (obj) {
          res = obj.text;
        }
      }
      return res;
    },
    limitMoney() {
      let res = "";
      if (this.bankCardInfo.bankCode !== void 0) {
        const obj = this.bankList.find(
          (ele) => ele.keyId == this.bankCardInfo.bankCode
        );
        if (obj) {
          if (this.bankCardInfo.payMode === "R") {
            res = obj.small;
          } else {
            res = obj.big;
          }
        }
      }
      return res;
    },
  },
  watch: {},
  filters: {
    fmtBankNum(value) {
      return accountCodeFormat(value);
    },
  },
  mixins: [bankCardSignHandleMixin],
  created() {},
  mounted() {},
  methods: {
    goSignBank() {
      if (["0", "6", "-1", "3"].includes(this.signFlag)) {
        this.signBeforeQuery();
      }
      // else if (this.signFlag == '3') {
      //   this.$toast('已签约成功,可直接支付');
      // }
      else {
        this.signCodeHandle(this.signFlag);
      }
    },
    toPayPaiHandle() {
      this.$router.push("/pay");
    },
  },
};
</script>

<style lang="less" scoped>
.mode_ul {
  padding: 0 12px;
  background: #ffffff;
}

/deep/.van-cell {
  padding-left: 0;
  padding-right: 0;
}
</style>
